<template>
	<div class="container">
		<navigationBar leftTitle="订单详情"></navigationBar>
		<div class="content" :style="'padding-top: ' + (navigationBarHeight-1) + 'px;'">
			<div class="address">
				<div class="left">
					<div class="name">
						<image class="icon" src="/static/icons/local.png" mode=""></image>
						<span class="addr nowrap">{{detail.address}}{{detail.addressDetail}}</span>
					</div>
					<div class="desc">
						<span class="user">{{detail.addressName}}</span><span>{{detail.phone}}</span>
					</div>
				</div>
			</div>
			<mwg-logistics :info="info.data"></mwg-logistics>
			<div class="buy">
				<div class="buy-left" @click="$navSkin.toProduct(detail.informationId)">
					<image
						v-if="detail.firstFileSuffix !== 'png' && detail.firstFileSuffix !== 'jpg' && detail.firstFileSuffix !== 'jpge'"
						:src="detail.firstCoverPath" class="buy-pic" mode="aspectFill" />
					<image v-else :src="detail.firstPicturePath" class="buy-pic" mode="aspectFill" />
					<div class="pri-wrap">
						<div class="pri-title">{{detail.title}}</div>
						<div class="pri-box">
							<span class="price"><span class="price-icon">￥</span>{{detail.price}}</span>
							<span class="attr" v-if="detail.freeShipping">包邮</span>
						</div>
						<div class="number-change">
							<div class="btn btn-right">
								<image src="/static/icons/reduce-num.png" mode=""></image>
							</div>
							<input type="digit" v-model="detail.amount">
							<div class="btn btn-left">
								<image src="/static/icons/add-num.png" mode=""></image>
							</div>

						</div>
					</div>
				</div>
			</div>
			<!-- <div class="upload">
				<div class="upload-title">定制部件的图片，单张图片大小不超过2M</div>
				<div class="upload-list">
					<div class="upload-item" @click="handlerUpload()">
						<image class="icon" mode="aspectFill" :lazy-load="true" src="/static/icons/upload.png" alt="" />
						<span class="add-title">添加图片</span>
					</div>
					<div class="upload-item" v-for="(item,index) in wordList" :key="index">
						<image class="del" src="/static/icon/icon_shanchu2.png" mode="" @click="del(index)"></image>
						<image :src="item.filePath" mode=""></image>
					</div>
				</div>
			</div> -->
			<div class="nav-list">
				<div class="nav-item">
					<div class="left">订单状态</div>
					<div class="right active">{{getStatusStr(detail.orderStatus)}}</div>
				</div>
				<div class="nav-item">
					<div class="left">成交价</div>
					<div class="right">¥{{detail.total}}</div>
				</div>
				<div class="nav-item">
					<div class="left">运费</div>
					<div class="right" v-if="detail.freeShipping">包邮</div>
					<div class="right" v-if="!detail.freeShipping">￥{{detail.shippingPrice}}</div>
				</div>
				<div class="nav-item">
					<div class="left">订单编号</div>
					<div class="right">{{detail.orderNumber}}</div>
				</div>
				<div class="nav-item">
					<div class="left">卖家昵称</div>
					<div class="right">{{detail.merchantNickname}}</div>
				</div>
				<div class="nav-item">
					<div class="left">下单时间</div>
					<div class="right">{{detail.createTime}}</div>
				</div>
			</div>
			<div class="footer-send">
				<!-- 买回来的 -->
				<block v-if="saleType == 0">
					<div class="btn" @click="$navSkin.toUserChat(detail.merchantUserId,detail.merchantNickname)">
						联系商家
					</div>
					<div class="right" v-if="detail.orderStatus == 1">
						<div class="want" @click="wechatPay(detail.id)">
							去付款
						</div>
					</div>
					<div class="right" v-if="detail.orderStatus == 4">
						<div class="want" @click="toEvaluate(detail.id)">
							评价
						</div>
					</div>
					<div class="right" v-if="detail.orderStatus == 3">
						<div class="want" @click="confirmReceive(detail.id)">
							确认收货
						</div>
					</div>
				</block>
				<!-- 卖出去的 -->
				<block v-else>
					<div class="btn" @click="$navSkin.toUserChat(detail.userId,detail.nickname)">
						联系客户
					</div>
					<div class="right" v-if="detail.orderStatus == 2">
						<div class="want" @click="confirmShipment(detail.id)">
							确认发货
						</div>
					</div>
				</block>

			</div>
		</div>

	</div>
</template>

<script>
	import data from '@/js/my/orderDetail/data.js';
	import methods from '@/js/my/orderDetail/methods.js';
	import {
		mapState
	} from 'vuex';
	import navigationBar from '../../components/navigationBar.vue';
	import mwgLogistics from '../../components/mwg-logistics/mwg-logistics.vue'
	export default {
		data,
		methods,
		onLoad(e) {
			this.id = e.id
			this.saleType = e.saleType
		},
		onShow() {
			this.getPageData()
			this.myUserId = uni.getStorageSync('userId')
		},
		onHide() {},
		components: {
			navigationBar,
			mwgLogistics
		},
		computed: {
			...mapState(['navigationBarHeight'])
		}
	};
</script>
<style>
	page,
	uni-page {
		background: rgb(250, 250, 250) !important;
	}
</style>
<style scoped lang="scss">
	@import '~@/style/my/orderDetail.scss';
</style>